﻿@model Lead2012.ViewModels.SettingViewModel
           
@{
    ViewBag.Title = "Cấu hình hiển thị";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<fieldset id="settings">
    <div class="content">
        <h2 class="app">
            <strong>Cấu hình hiển thị</strong>
        </h2>
        <div class="title nomargin">
            <h3>Cấu hình hệ thống</h3>
        </div>
        <div class="panel">
            <div class="title nomargin">
                <h3>Cấu hình các trường dữ liệu có sẵn trên hệ thống và được map do quản trị</h3>
            </div>
            
            <div class="match-header">
                <div id="matchleftside" class="mh-left" data-bind="itemDrop:{}">
                    <div class="mh-headers">
                        <span class="mh-hdr hdr1">Cấu hình hiện tại</span>
                    </div>
                    <ul class="mh-yhdrs-list" id='leftPanel' data-bind="foreach: FieldSystemList">
                        <li>
                            <span class="headername" data-bind="text: TextColumnName,attr:{title: TextColumnName,id:FieldId}" style ="width:120px;height:30px;display:block;float:left;"></span>                               
                            <span class="i-matched" data-bind="itemDragBack:{}, attr:{id:FieldId+'M'}">
                                <span data-bind="text:Tag, attr:{title:Tag}"> </span>
                            </span>
                        </li>
                    </ul>
                </div>
                 <div id="matchrightside" class="mh-right" data-bind="itemDropBack:{}">
                    <div class="mh-headers">
                        <span class="mh-hdr hdr1">Các trường dữ liệu của hệ thống</span>
                    </div>
                    <ul class="mh-360hdrs-list" data-bind="foreach:ListFields">
                        <li>
                            <h3 data-bind="text:Title"></h3>                            
                            <span class="items-container" data-bind="visible: Groups==null || Groups.length==0?false:true, foreach:Groups">
                                <h3 data-bind="text:Title"></h3>
                                <span class="item-group" data-bind="attr:{'class': (ko.utils.arrayIndexOf($parent.Groups, $data) == $parent.Groups.length-1)? 'item-group last':'item-group'}, foreach:Fields" >
                                    <span class="i-matched1" data-bind="itemDrag:{}">
                                        <span class="FieldName" data-bind="text:Title,attr:{title: Title,id:Id}" >
                                        </span>
                                        
                                    </span>
                                </span>
                            </span>

                            <span class="item-group" data-bind="foreach:Fields">
                                <span class="i-matched1" data-bind="itemDrag:{}">
                                    <span class="FieldName" data-bind="text:Title,attr:{title: Title,id:Id}">
                                    </span>
                                    
                                </span>
                            </span>
                        </li>
                    </ul>
                </div>
            </div>
        </div>

         <h3 class="centered-wbtn centered-wbtn-bottom save">
            <a class="btn btn-next right" id="saveChange" data-bind="click: ChangeSettings" href="javascript:void(0)">Next</a>
            <div class="clear"></div>
        </h3>
    </div>
</fieldset>
<script type="text/javascript">
    var data = @(Html.Raw(Json.Encode(Model)));
</script>
<script src="/Scripts/ChangeSettings/Settings.js" type="text/javascript"></script>